
<template>
	<div class="index">

		<div class="center">
			<left></left>
			<div class="right">
          <top></top>
          <!-- <div class="hei10"></div>
          <div class="where" style="background: #fff; padding: 10px 30px; font-size: 14px; color: #595959;">当前位置：分销后台><router-link to="/productionDelivery" style="color: #409eff;">商品销售中心</router-link></div>
          --><div class="hei10"></div>

        <div class="o_ul">
          <router-link class="o_li" to="/productionDelivery">销售中的商品</router-link>
          <router-link class="o_li acts bgw" to="/productionDelivery/productionDeliverysale">已下架的商品</router-link>

        </div>
        <div class="row">
          <el-form ref="form" @submit.native.prevent :model="form" label-width="80px">
            <el-form-item label="商品名称" class="bgh" style="margin-right: 20px;">
              <el-input v-model="form.title" placeholder="请输入商品名称"></el-input>
            </el-form-item>
            <el-form-item label="供应商" class="bgh" style="margin-right: 20px;">
              <el-input v-model="form.parent_name" placeholder="请输入供应商"></el-input>
            </el-form-item>
            <el-form-item label="商品编码" class="bgh" style="margin-right: 20px;">
              <el-input v-model="form.fetch_code" placeholder="请输入商品编码"></el-input>
            </el-form-item>
            <el-form-item label="产品编码" class="bgh" style="margin-right: 20px;">
              <el-input v-model="form.sku" placeholder="请输入产品编码"></el-input>
            </el-form-item>
            <el-button type="danger" round @click="search">搜索</el-button>
          </el-form>
        </div>
        <div class="con" v-loading="loading" style="padding: 0 20px;">
          <el-table :data="list" border style="font-size: 14px;" align="center">
            <el-table-column label="商品信息" width="400">
              <template slot-scope="scope">
                <div style="display: flex;">
                  <div style="cursor: pointer; width: 140px; height:110px; margin:0 20px 0 10px; overflow: hidden;: hidden;" @click="tiaozhuan(scope.row.id,scope.row.order_pages_id,scope.row.product_id)" v-if="scope.row.image1 == ''"><img src="../../../static/img/kenan.jpg"
                      style="width: 110px; "></div>
                  <div style="cursor: pointer; width: 140px; height:110px; margin:0 20px 0 10px; overflow: hidden;: hidden;" @click="tiaozhuan(scope.row.id,scope.row.order_pages_id,scope.row.product_id)" v-if="scope.row.image1 != ''"><img :src="scope.row.image1"
                      style="width: 110px; "></div>
                  <div  style="width:285px; ">
                    <div style="color: #197CFF; font-size: 14px;" @click="tiaozhuan(scope.row.id,scope.row.order_pages_id,scope.row.product_id)">{{scope.row.title}}</div>
                    <div style="font-size: 14px; display: flex; flex-wrap: wrap;" v-if="scope.row.selling_point != ''">
                      <div v-for="item in scope.row.selling_point" :key="item" class="yansebutong">
                        <el-tooltip class="item" effect="dark" :content="item" placement="top-start"  v-if="item.length > 11">
                          <div class="slh">{{item}}</div>
                        </el-tooltip>
                        <div  class="slh" v-if="item.length <= 11">{{item}}</div>
                      </div>
                    </div>

                    <div style="line-height: 30px;" @dblclick="copycode(scope.row.fetch_code)">商品编码:{{scope.row.fetch_code}}</div>
                    <div style="line-height: 30px;">发布时间：{{scope.row.created_at}}</div>

                  </div>
                </div>
              </template>
            </el-table-column>
            <el-table-column label="产品">
              <template slot-scope="scope">
                <div>{{scope.row.parent_name}}</div>
                <div>{{scope.row.parent_title}}</div>
              </template>
            </el-table-column>
            <el-table-column label="佣金额度">
              <template slot-scope="scope">
                <div v-if="scope.row.commission == -1.00 ? true : false">未编辑</div>
                <div v-if="scope.row.commission == -1.00 ? false : true">{{scope.row.commission}}</div>

              </template>
            </el-table-column>
            <el-table-column label="商品编码">
              <template slot-scope="scope">
                <div>{{scope.row.fetch_code}}</div>
                <div style="color: #409EFF; cursor: pointer;" @click="biangengshow(scope.row.page_id,scope.row.parent_id)">佣金变更记录</div>
              </template>
            </el-table-column>
            <el-table-column label="供应商">
              <template slot-scope="scope">
                <div>{{scope.row.parent_name}}</div>
                <el-button type="text" v-if="P0203" @click="ppp(scope.row.id,scope.row.product_id,scope.row.title)">查看分销商</el-button>
              </template>
            </el-table-column>
            <el-table-column label="下架时间">
              <template slot-scope="scope">
                <div>{{scope.row.updated_at}}</div>
              </template>
            </el-table-column>
            <el-table-column label="操作" align="center" width="300px">
              <template slot-scope="scope">
                <div class="dh" @click="chaizhuan(scope.row,1)">
                  转单 拆单
                  <div class="dh2"></div>
                </div>
                <div v-if="scope.row.is_main == 0">
                  <el-button type="text"   @click="zhiding2(scope.row,1)">添加到主推</el-button>
                  <el-tooltip class="item" effect="dark" content="主推后分销商添加上游商品时将优先看到主推商品" placement="top-start">
                  	<i class="el-icon-question" style="color: #409EFF; font-size: 20px; margin-left: 5px; cursor: pointer;" ></i>
                  </el-tooltip>
                </div>
                <div><el-button type="text" v-if="scope.row.is_main == 1"  @click="zhiding2(scope.row,0)">取消主推</el-button></div>

                <el-button type="primary" plain v-if="P0202" size="mini" @click="shangjia(scope.row.id,scope.row.commission)">上架商品
                </el-button>

                <el-button type="primary" plain style="margin: 10px 0;" v-if="P0202" size="mini" @click="deletes(scope.row.id)">删除商品</el-button>
                <el-dropdown trigger="click" @command="choosefix" v-if="P0202">
                  <span class="el-dropdown-link" @click="choosefixid(scope.row.id,scope.row.product_id)" style="color: #409EFF; cursor: pointer;">
                    修改编辑<i class="el-icon-arrow-down el-icon--right" @click="choosefixid(scope.row.id,scope.row.product_id)"></i>
                  </span>
                  <el-dropdown-menu slot="dropdown">

                    <el-dropdown-item v-if="scope.row.id == scope.row.order_pages_id" command="b">修改产品信息</el-dropdown-item>
                    <el-dropdown-item command="c">修改商品信息</el-dropdown-item>
                    <el-dropdown-item command="a">佣金及分销商可见</el-dropdown-item>
                    <el-dropdown-item command="e">切换产品渠道</el-dropdown-item>
                  </el-dropdown-menu>

                </el-dropdown>
              </template>
            </el-table-column>
          </el-table>
         <!-- <div class="list" style="padding-bottom: 0; padding-top: 0;">
            <div class="th1">产品标题</div>
            <div class="th8">产品</div>
            <div class="th2">佣金额度</div>
            <div class="th3">商品编码</div>
            <div class="th4">供应商</div>
            <div class="th5">创建时间</div>
            <div class="th6">操作</div>
          </div>
          <div class="list" v-for="item in list" :key="item.id">
            <div class="td1" @click="tiaozhuan(item.id,item.order_pages_id,item.product_id)">
              <img :src="item.image1" v-if="item.image1 != ''">
              <img src="../../../static/img/kenan.jpg" v-if="item.image1 == ''">
            </div>
            <div class="td2" @click="tiaozhuan(item.id,item.order_pages_id,item.product_id)">
              <div class="title">{{item.title}}</div>
              <div class="yd" v-if="item.selling_point != ''">
                <span v-for="item in item.selling_point" :key="item">{{item}}</span>
              </div>
              <div class="alt">结算要求：{{item.commission_rule}}</div>
            </div>
            <div class="td8">
              <div>{{item.parent_name}}</div>
              <div>{{item.parent_title}}</div>
            </div>
            <div class="td3" v-if="item.commission == -1.00 ? true : false">未编辑</div>
            <div class="td3" v-if="item.commission == -1.00 ? false : true">{{item.commission}}</div>
            <div class="td4" @dblclick="copycode(item.fetch_code)">
              <el-tooltip effect="dark" popper-class="tooltip" placement="top">
                <div slot="content">{{item.fetch_code}}</div>
                <div>{{item.fetch_code}}</div>
              </el-tooltip>
            </div>
            <div class="td5">{{item.parent_name}}</div>
            <div class="td6">{{item.updated_at}}</div>
            <div class="td7">
              <el-button type="primary" v-if="P0202" size="mini" plain @click="shangjia(item.id,item.commission)">上架商品
              </el-button>
              <el-button type="primary" v-if="P0202" size="mini" plain @click="deletes(item.id)">删除商品</el-button>
              <div>
                <el-dropdown trigger="click" @command="choosefix" v-if="P0202">
                  <span class="el-dropdown-link" @click="choosefixid(item.id,item.product_id)">
                    修改编辑<i class="el-icon-arrow-down el-icon--right" @click="choosefixid(item.id,item.product_id)"></i>
                  </span>
                  <el-dropdown-menu slot="dropdown">

                    <el-dropdown-item v-if="item.id == item.order_pages_id" command="b">修改产品信息</el-dropdown-item>
                    <el-dropdown-item command="c">修改商品信息</el-dropdown-item>
                    <el-dropdown-item command="a">佣金及分销商可见</el-dropdown-item>
                    <el-dropdown-item command="e">切换产品渠道</el-dropdown-item>
                  </el-dropdown-menu>

                </el-dropdown>
              </div>

            </div>
          </div> -->

          <el-pagination background layout="total,prev, pager, next" :current-page="page" @current-change="fanye"
            :page-size="pagesize" :total="total"></el-pagination>
        </div>
      </div>
    </div>
    <el-dialog title="调整基础产品" :visible.sync="basislog" width="600px">
      <div>
        <el-radio-group v-model="basis" @change="getallshop">
          <el-radio label="0">调整为我发布的基础产品</el-radio>
          <el-radio label="1">调整为供应商的在售商品</el-radio>
        </el-radio-group>
        <div class="basispro" v-if="basis == 0">
          <el-select v-model="proid" filterable placeholder="请选择产品">
            <el-option v-for="item in prolists" :key="item.id" :label="item.name" :value="item.id"></el-option>
          </el-select>
        </div>
        <div class="basispro" v-if="basis == 1">
          <el-select v-model="shopid" filterable placeholder="请选择商品">
            <el-option v-for="item in shoplists" :key="item.id" :label="item.title" :value="item.id"></el-option>
          </el-select>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="basislog = false">取 消</el-button>
        <el-button type="primary" @click="basisgo">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="变更记录" :close-on-click-modal="false"  :visible.sync="biangenglog" width="800px">
    	<el-table :data="biangenglist" style="text-align: center;" align="center" border >
    	  <el-table-column label="时间" width="200px">
    	    <template slot-scope="scope">
    	      <span>{{ scope.row.created_at }}</span>
    	    </template>
    	  </el-table-column>
    	  <el-table-column label="规则">
    	    <template slot-scope="scope">
    	      <span v-if="scope.row.active_commission!=0">已激活，发放佣金{{scope.row.active_commission}}元.</span>
    	      <span v-if="scope.row.first_recharge_one!=0">首充大于{{scope.row.first_recharge_one}}元，发放佣金{{scope.row.first_recharge_one_commission}}元或者</span>
    	      <span v-if="scope.row.first_recharge_two!=0">首充大于{{scope.row.first_recharge_two}}元，发放佣金{{scope.row.first_recharge_two_commission}}元.</span>
    	      <span v-if="scope.row.recharge_amount_one!=0">累计充值大于{{scope.row.recharge_amount_one}}元，发放佣金{{scope.row.recharge_amount_one_commission}}元且</span>
    	      <span v-if="scope.row.recharge_amount_two!=0">累计充值大于{{scope.row.recharge_amount_two}}元，发放佣金{{scope.row.recharge_amount_two_commission}}元.</span>
    	    </template>
    	  </el-table-column>

    	</el-table>
    	<span slot="footer" class="dialog-footer">

    		<el-button type="primary"@click="biangenglog = false">确 定</el-button>
    	</span>
    </el-dialog>
    <!-- <foot></foot> -->
  </div>
</template>

<script>
  import axios from 'axios'
  import top from '@/components/top.vue'
  import left from '@/components/left.vue'
  import foot from '@/components/foot.vue'
  export default {
    components: {
      "left": left,
      "top": top,
      "foot": foot
    },
    name: 'productionDeliverysale',
    data() {
      return {
        msg: "hello",
        form: {
          title: "",
          mine: "",
          parent_name: "",
          sku: "",
          fetch_code: ""
        },
        checked: false,
        loading: true,
        list: "",
        total: 0,
        chooseid: "",
        chooseproductid: "",
        page: 1,
        pagesize: 20,
        func_C02: false,
        shop_id: "",
        basis: '0',
        prolists: {},
        basislog: false,
        proid: "",
        shopid: "",
        shoplists: {},
        basisshop: "",
        P0202: false,
        dianpuid:"",
        biangenglog:false,
        biangenglist:[],
        P0203:false
      }
    },
    created() {
      //权限问题
      var user = JSON.parse(localStorage.getItem('USER'));
      this.user_func = user.functions
      for (var i in this.user_func) {
      	if (this.user_func[i] != null) {
      		var func_number = this.user_func[i].code
      	}
      	if (func_number.indexOf("P0203") >= 0) {
      		this.P0203 = true
      	}
      }

      this.dianpuid = JSON.parse(localStorage.getItem('SHOP')).shop_id;
      //按回车键搜索
      var that = this
      document.onkeydown = function(e) {
        var ev = document.all ? window.event : e;
        if (ev.keyCode == 13) {
          that.search()
        }
      }

      this.getpro();

      //权限问题
      var user = JSON.parse(localStorage.getItem('USER'));
      this.user_func = user.functions
      for (var i in this.user_func) {
        var func_number = this.user_func[i].code
        if (func_number.indexOf("P0202") >= 0) {
          this.P0202 = true
        }
      }

      axios.get('/api/gth/user/shop')
        .then(response => {
          if (response.data.msg.code == 0) {
            this.shop_id = response.data.data.shop_id
          } else {
            if (response.data.msg.code == 50401) {
              that.$router.push({
                path: "/login"
              });
              return false
            }
            that.$message.error(response.data.msg.info);
          }
        })

      this.getpros()
    },
    methods: {
      chaizhuan:function(item,act){
        this.$router.push('/productionDelivery/zhuandan?id='+item.id+'&name='+item.title+'&act='+act)
      },
      ppp: function(id, productid, name) {
      	this.$router.push({
      		path: '/productionDelivery/watchMyDistributor',
      		query: {
      			id: id,
      			title: name
      		}
      	})
      },
      zhiding2:function(item,n){
        axios.get('/api/plan-market/product/main',{params:{
          id:item.id,
          is_main:n
        }})
        	.then(response => {
        		if (response.data.msg.code == 0) {
              this.$message.success('操作成功');
        			this.getpro()
        		} else {
        			this.$message.error(response.data.msg.info);
        		}
        	})
      },
      biangengshow:function(id,parent_id){
        axios.get('/api/plan-market/commission/page/configs/list',{params:{
          page_id:id,
		  parent_id:parent_id
        }})
        	.then(response => {
        		if (response.data.msg.code == 0) {
              this.biangenglist = response.data.data
              this.biangenglog = true
        		} else {
        			this.$message.error(response.data.msg.info);
        		}
        	})

      },
      //更换基础产品
      basisgo: function() {
        this.loading = true
        var that = this
        if (this.basis == 0) {
          axios.post('/api/plan-market/page/product/update', {
              product_id: this.proid,
              page_id: this.chooseid
            })
            .then(response => {
              if (response.data.msg.code == 0) {
                that.$message.success("修改成功");
                that.getpro()
                that.basislog = false
              } else {
                that.$message.error(response.data.msg.info);
              }
            })
        }
        if (this.basis == 1) {
          axios.post('/api/plan-market/page/product/update', {
              parent_page_id: this.shopid,
              page_id: this.chooseid
            })
            .then(response => {
              if (response.data.msg.code == 0) {
                that.$message.success("修改成功");
                that.getpro()
                that.basislog = false
              } else {
                that.$message.error(response.data.msg.info);
              }
            })
        }
      },
      //获取全部基础产品
      getpros: function() {
        var that = this
        axios.get('/api/gth/products/list?page_size=1000')
          .then(response => {
            if (response.data.msg.code == 0) {
              that.prolists = response.data.data.data
            } else {
              that.$message.error(response.data.msg.info);
            }
          })
      },
      getshops: function() {
        //获取商品
        var that = this;
        axios.get('/api/gth/supplier/products?page_size=1000')
          .then(response => {
            if (response.data.msg.code == 0) {
              that.shoplists = response.data.data.data
            } else {
              if (response.data.msg.code == 50401) {
                that.$router.push({
                  path: "/login"
                });
                return false
              }
              that.$message.error(response.data.msg.info);
            }
          })
      },
      getallshop: function() {
        if (this.basis == 0) {
          this.getpros()
        }
        if (this.basis == 1) {
          this.getshops()
        }
      },
      deletes: function(id) {
        var that = this
        this.$confirm('删除商品将导致订单流转链条断裂，您和您分销商的订单将无法流转至生产方，请谨慎删除。', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          axios.post('/api/plan-market/order-page/delete', {
              id: id
            })
            .then(response => {
              if (response.data.msg.code == 0) {
                that.$message({
                  message: '删除成功！',
                  type: 'success'
                });
                that.loading = true
                that.getpro()
              } else {
                if (response.data.msg.code == 50401) {
                  that.$router.push({
                    path: "/login"
                  });
                  return false
                }
                that.$message.error(response.data.msg.info);
              }
            })
        })
      },
      //跳转
      tiaozhuan: function(id, orderid, product_id) {

        // var type = 1 //看看是不是自己的商品 1是 2不是
        // if(id == orderid){type = 1}else{type = 2}



        // if( this.shop_id == 50481 || this.shop_id == 304676){
        //     if(type == 1){
        //         window.open(window.location.origin+"/#/productHistory?id="+product_id+"&type="+type)
        //     }else{
        //         console.log(type)
        //         window.open(window.location.origin+"/#/productHistory?id="+id+"&type="+type)
        //     }
        // }else{
        //     window.open(window.location.origin+"/#/productSee?id="+id)
        // }
        window.open(window.location.origin +  window.location.pathname + "#/productionDelivery/shopdetail?id=" + id)
      },
      //翻页
      fanye: function(page) {
        this.loading = true
        this.page = page
        this.getpro()
      },
      //保存要修改商品的id和产品id
      choosefixid: function(id, productid) {
        console.log(id)
        this.chooseid = id
        this.chooseproductid = productid
      },
      //修改商品信息页面跳转
      choosefix: function(command) {
        if (command == "a") {
          this.$router.push({
            path: '/productionDelivery/fixproductmoney',
            query: {
              id: this.chooseid
            }
          })
        }
        if (command == "b") {
          this.$router.push({
            path: '/productionBasismanag/fixproductionBasis',
            query: {
              id: this.chooseproductid
            }
          })
        }
        if (command == "c") {
          this.$router.push({
            path: '/productionDelivery/fixPros',
            query: {
              id: this.chooseid
            }
          })
        }
        if (command == "e") {
          this.basislog = true
        }
      },
      //获取商品
      getpro: function() {
        this.form.title = this.form.title.trim()
        this.form.sku = this.form.sku.trim()
        this.form.parent_name = this.form.parent_name.trim()
        this.form.fetch_code = this.form.fetch_code.trim()
        var that = this;
        axios.get('/api/gth/order-pages2?status=0&_page=' + this.page + '&_page_size=' + this.pagesize +
            '&title=' + encodeURIComponent(this.form.title) + '&parent_name=' + encodeURIComponent(this.form
              .parent_name) + '&mine=' + this.form.mine + '&fetch_code=' + encodeURIComponent(this.form.fetch_code) +
            '&sku=' + encodeURIComponent(this.form.sku))
          .then(response => {
            if (response.data.msg.code == 0) {
              that.total = response.data.data.total
              that.list = response.data.data.data
              that.loading = false
            } else {
              if (response.data.msg.code == 50401) {
                that.$router.push({
                  path: "/login"
                });
                return false
              }
              that.$message.error(response.data.msg.info);
            }
          })
      },
      //搜索
      search: function() {
        this.page = 1
        this.loading = true
        this.getpro()
      },
      //复制
      copycode: function(code) {
        var that = this;
        this.$copyText(code)
          .then(res => {
            that.$message.success("复制成功");
          });
      },
      //上架
      shangjia: function(id, commission) {
        var that = this;

        if (commission == -1.00) {
          this.$router.push({
            path: '/productionDelivery/fixproductmoney',
            query: {
              id: id
            }
          })
        } else {
          var formData = new FormData();
          formData.append("order_page_id", id);
          formData.append("status", 100);
          axios.post('/api/gth/order-page/put-sale', formData)
            .then(response => {
              if (response.data.msg.code == 0) {
                //绑定分销商成功后上架（落基进入审核）

                if (this.shop_id == 50481 || this.shop_id == 304676) {
                  that.$message({
                    message: '商品上架已发起审核！',
                    type: 'success'
                  });
                } else {
                  that.$message({
                    message: '商品已上架！',
                    type: 'success'
                  });
                }
                this.loading = true
                this.getpro()
              } else {
                if (response.data.msg.code == 50401) {
                  that.$router.push({
                    path: "/login"
                  });
                  return false
                }
                that.$message.error(response.data.msg.info);
              }
            })
        }

      }
    }
  }
</script>

<style lang="scss" scoped>
  @import "@/assets/zuixin.scss";
  .index {

    .dh{
      font-size: 14px; cursor: pointer;
      font-weight: bold;
      background: linear-gradient(117.53deg, rgb(12, 131, 255),rgb(255, 0, 246));
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      color: transparent;
      position: relative;
      overflow: hidden;
    }
    .dh2{
      position: absolute; left: 0; top: -12px; height: 46px; width: 10px; transform: rotate(45deg); background: rgba(255, 255, 255, 0.5); animation: haha 2s infinite forwards; z-index: 2;
    }

    .slh{white-space: nowrap;
      	text-overflow: ellipsis;
      	overflow: hidden;
      	word-break: break-all; max-width: 140px;}

    .yansebutong {
      margin-right: 10px; line-height: 20px; color: #FFF;
      margin-bottom: 5px;padding: 0 5px;border-radius: 2px;

    }

    .yansebutong:nth-child(1) {
        border: 1px #EEF7FF solid; color: #EEF7FF;
    }

    .yansebutong:nth-child(2) {

       border: 1px #FBB03B solid; color: #FBB03B;
    }

    .yansebutong:nth-child(3) {

       border: 1px #409EFF solid; color: #409EFF;
    }

    .yansebutong:nth-child(4) {
       border: 1px peru solid; color: peru;

    }
    .yansebutong:nth-child(5) {
       border: 1px peru solid; color: peru;

    }


        .o_ul {
          background: #F9F9F9;
          display: flex;

          .o_li {
            flex-basis: 160px;
            line-height: 45px;
            display: block;
            color: #727272;
            border-top: 3px #F9F9F9 solid;
            font-size: 14px;
            text-align: center;
          }

          .act {
            border-top: 3px #DD2727 solid;
            background: #FFFFFF;
          }
        }

        .row {
          display: flex;
          justify-content: space-between;
          padding: 30px;

          .el-form {
            display: flex;

            /deep/ .el-form-item {
              margin-bottom: 0;
            }

            /deep/ .el-button {
              margin-left: 20px;
            }
          }

          .only {
            padding: 7px;
          }

          /deep/ .el-button {

            margin-top: 2px;
          }
        }

        .row2 {
          display: flex;
          padding-left: 30px;

          .el-button {
            margin-right: 30px
          }
        }

        .row3 {
          background: #EEF7FF;
          padding: 5px 0;
          color: #FFFFFF;
          line-height: 50px;
          display: flex;
          margin-top: 30px;
          margin-bottom: 15px;
          justify-content: space-between;

          .dlogo {
            margin-left: 0px;
            background: #FFFFFF;
            border-radius: 25px;
            margin-right: 10px;

            img {
              width: 30px;
              display: block;
              padding: 10px;
            }
          }

          .dtitle {
            font-size: 20px;
          }

          .dlogo2 {
            background: #FFFFFF;
            color: #EEF7FF;
            font-size: 20px;
            cursor: pointer;
            display: flex;
            justify-content: center;
            align-items: center;
            border-radius: 14px;
            width: 24px;
            ;
            height: 24px;
            position: relative;
            top: 13px;
            left: 10px;
          }

          .dcon {
            font-size: 14px;
          }

          .dget {
            line-height: 26px;
            color: #EEF7FF;
            font-size: 14px;
            background: #FFFFFF;
            height: 26px;
            margin-top: 14px;
            padding: 0px 20px;
            border-radius: 15px;
          }

          .dmy {
            font-size: 14px;
            padding: 0 20px;
          }
        }

        .list:nth-child(2) {
          border-top: 0;
        }


        .el-pagination {
          text-align: right;
          margin: 20px 0
        }



    .basispro {
      margin-top: 20px;
    }
  }
</style>
